<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui"
	template="../resources/template/template_bootstrap.xhtml">

	<ui:define name="title">Gerar newsletter</ui:define>

	<ui:define name="conteudo">

		<p:outputPanel layout="block"
			rendered="#{usuarioMB.permissaoAdministrador()}">

			<h:form id="frm" prependId="false">

				<p:growl autoUpdate="true" globalOnly="true" life="5000"></p:growl>

				<p:panel id="pnlBusca">

					<div class="row-fluid">
						<div class="span12">
							<h:outputText styleClass="texto-informativo"
								value="Digite o nome do produto desejado no campo 'Produto' e clique no botão 'Buscar'." />
						</div>
					</div>


					<div class="row-fluid">
						<div class="span6">

							<p:message for="txtNomeBuscar" showDetail="true" />
						</div>
					</div>


					<div class="row-fluid margin-top">
						<div class="span3">
							<p:outputLabel value="Produto" for="txtNomeBuscar"
								styleClass="text-right" />
						</div>
						<div class="span3">
							<p:inputText id="txtNomeBuscar" value="#{newsMB.nomeBuscar}"
								validatorMessage="Insira pelo menos 4 letras para realizar a busca.">
								<f:validateLength minimum="4" />
							</p:inputText>
						</div>
						<div class="span6">
							<p:commandLink value="Buscar" styleClass="btn-virtual-inline"
								actionListener="#{newsMB.buscarProdutos}" update="@form" />
						</div>
					</div>




					<p:dataTable value="#{newsMB.produtos}" var="produto"
						rendered="#{newsMB.produtos.size()>0}" id="tblProdutos"
						filteredValue="#{newsMB.produtosFiltro}" rows="5"
						rowsPerPageTemplate="5, 10,20,30" paginatorAlwaysVisible="false"
						paginator="true"
						emptyMessage="Digite o nome do produto desejado no campo 'Produto' e clique no botão 'Buscar'."
						styleClass="tabela-carrinho margin-top table-header-left">

						<f:facet name="header">
							<h:outputText styleClass="texto-informativo"
								value="Selecione os produtos desejados e clique em 'Incluir' para adicioná-los à newsletter" />
						</f:facet>

						<p:column headerText="Categoria" style="width:210px;"
							sortBy="#{produto.categoria.nome}">
							<h:outputText title="#{produto.categoria.nome}"
								value="#{produto.categoria.nome.toString().substring(0,(produto.categoria.nome.length()>20 ? 20 : produto.categoria.nome.length()))}" />
							#{produto.categoria.nome.length() > 20 ? "..." : ""}
										</p:column>

						<p:column headerText="Produto" filterBy="#{produto.nome}"
							filterStyleClass="filter" sortBy="#{produto.nome}">

							<a href="/exibir/produtodetalhes.jsf?p=#{produto.id}"
								class="link-produto"> <h:outputText title="#{produto.nome}"
									value="#{produto.nome.toString().substring(0,(produto.nome.length()>25 ? 25 : produto.nome.length()))}#{(produto.nome.length()>25 ? '...' : '')}" />
							</a>
						</p:column>


						<p:column headerText="Modelo" filterBy="#{produto.modelo}"
							filterStyle="width:30px;" filterStyleClass="filter"
							sortBy="#{produto.modelo}">
							<h:outputText value="#{produto.modelo}" />
						</p:column>


						<p:column headerText="Fabricante">
							<h:outputText value="#{produto.fabricante}" />
						</p:column>

						<p:column headerText="Preço" styleClass="text-right">
							<h:outputText value="#{produto.preco_venda}">
								<f:convertNumber type="currency"></f:convertNumber>
							</h:outputText>
						</p:column>


						<p:column headerText="C/Desconto" styleClass="text-right">
							<h:outputText value="#{produto.preco_venda_desconto}">
								<f:convertNumber type="currency"></f:convertNumber>
							</h:outputText>
						</p:column>


						<p:column headerText="Incluir">
							<p:commandLink value="Incluir"
								action="#{newsMB.adicionarProduto(produto)}" update="@form" />
						</p:column>

					</p:dataTable>
				</p:panel>

				<p:dataTable value="#{newsMB.produtosNews}" var="p"
					rendered="#{newsMB.produtosNews.size() > 0}"
					styleClass="tabela-carrinho table-header-left margin-top">


					<f:facet name="header">
						<h:outputText styleClass="texto-informativo"
							value="Clique em 'Gerar' para visualizar a newsletter e enviar para os clientes cadastrados." />
					</f:facet>

					<p:column headerText="Categoria" sortBy="#{p.categoria.nome}"
						style="width:210px;">
						<h:outputText title="#{p.categoria.nome}"
							value="#{p.categoria.nome.toString().substring(0,(p.categoria.nome.length()>20 ? 20 : p.categoria.nome.length()))}" />
							#{p.categoria.nome.length() > 20 ? "..." : ""}
								</p:column>

					<p:column headerText="Produto" filterBy="#{p.nome}"
						filterStyleClass="filter" sortBy="#{p.nome}">
						<h:outputText title="#{p.nome}"
							value="#{p.nome.toString().substring(0,(p.nome.length()> 25 ? 25 : p.nome.length()))}" />
							#{p.nome.length() > 25 ? "..." : ""}
						</p:column>


					<p:column headerText="Modelo" filterBy="#{p.modelo}"
						filterStyleClass="filter" filterStyle="width:30px;"
						sortBy="#{p.modelo}">
						<h:outputText value="#{p.modelo}" />
					</p:column>


					<p:column headerText="Fabricante">
						<h:outputText value="#{p.fabricante}" />
					</p:column>


					<p:column headerText="Preço" styleClass="text-right">
						<h:outputText value="#{p.preco_venda}">
							<f:convertNumber type="currency"></f:convertNumber>
						</h:outputText>
					</p:column>


					<p:column headerText="C/Desconto" styleClass="text-right">
						<h:outputText value="#{p.preco_venda_desconto}">
							<f:convertNumber type="currency"></f:convertNumber>
						</h:outputText>
					</p:column>


					<p:column headerText="Remover">
						<p:commandLink value="Remover"
							actionListener="#{newsMB.setProduto(p)}"
							oncomplete="dialog.show()">
						</p:commandLink>
					</p:column>

				</p:dataTable>

				<div class="row-fluid">
					<div class="span12">
						<p:commandLink value="Gerar" action="#{newsMB.gerar()}"
							styleClass="btn-virtual"></p:commandLink>
					</div>
				</div>

				<p:confirmDialog message="Deseja remover o produto?"
					widgetVar="dialog">
					<p:commandButton value="Sim" process="@this"
						actionListener="#{newsMB.removerProduto(null)}"
						oncomplete="dialog.hide()" styleClass="ui-confirmdialog-yes"
						icon="ui-icon-check" update="@form" />
					<p:commandButton value="Não" process="@this"
						onclick="dialog.hide()" icon="ui-icon-close" />
				</p:confirmDialog>

			</h:form>

		</p:outputPanel>
	</ui:define>

</ui:composition>